import {Suspense} from "react"
import 'antd/dist/reset.css'
// import "./App.css"
// 引入守卫
import useGuard from "./hooks/useGuard"
// 引入路由
import routes from "./router/routes"
// 引入布局组件
import LayoutBase from "./layouts"
import {ConfigProvider} from "antd"


const App = () => {

  // 使用自定义的hooks来处理路由守卫
  let Element = useGuard({routes,storageType:'qf-token'})

  return (
    <ConfigProvider>
      <div className="app">
        <LayoutBase>
          <Suspense>
            {/* <Spin tip="正在加载" spinning={false}> */}
              {Element}
            {/* </Spin> */}
          </Suspense>
        </LayoutBase> 
      </div>
    </ConfigProvider>
  )
}

export default App;
